﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
<meta http-equiv="pragma" content="no-cache" />

<meta name="viewport" content="user-scalable=no"/>

<title>红动五月</title>

<link rel="stylesheet" type="text/css" href="../css/weui.css" />

<script type="text/javascript" src="../js/wejs/zepto.min.js"></script>
<script type="text/javascript" src="../js/wejs/jweixin-1.0.0.js"></script>
<script type="text/javascript" src="../js/alert-common/common.js"></script>

<script type="text/javascript" src="../js/jquery-1.7.2-min.js"></script>
<script type="text/javascript" src="../js/common/common.js"></script>
<script type="text/javascript" src="../js/easing.js"></script>
<script type="text/javascript" src="../js/snowfall.jquery.js"></script>
<script>
//改写alert
window.alert = function(txt)
{
    var shield = document.createElement("DIV");
    shield.id = "shield";
    shield.style.position = "absolute";
    shield.style.left = "0px";
    shield.style.top = "0px";
    shield.style.width = "100%";
    shield.style.height = "100%";
    shield.style.background = "#333";
    shield.style.textAlign = "center";
    shield.style.zIndex = "19901000";
    shield.style.filter = "alpha(opacity=.5)";
    shield.style.opacity = ".5";
    var alertFram = document.createElement("DIV");
    alertFram.id="alertFram";
    alertFram.style.position = "absolute";
    alertFram.style.left = "7%";
    alertFram.style.top = "40%";
    alertFram.style.width = "86%";
    alertFram.style.background = "#ccc";
    alertFram.style.overflow = "hidden";
    alertFram.style.textAlign = "center";
    alertFram.style.borderRadius = "5px";
    alertFram.style.zIndex = "19901024";
    strHtml = "<ul style=\"list-style:none;margin:0px;padding:0px;width:100%\">\n";
    //strHtml += " <li style=\"background:#FFFFFF;font-size:16px;text-align:center;height:30px;line-height:30px;border-bottom: 1px solid #EBEBEB;\">提 示</li>\n";
    strHtml += " <li style=\"padding:1.5rem;background:#fff;text-align:center;font-size:2.5rem;border-bottom: 1px solid #EBEBEB;line-height:5rem;\">"+txt+"</li>\n";
    strHtml += " <li style=\"padding:1.5rem;background:#FFFFFF;text-align:center;font-size:3rem;height:5rem;line-height:5rem;\"><span onclick=\"doOk()\" style=\"width: 50%;cursor: pointer;\"><font color=\"#0BB20C\">知道了</font></span></li>\n";
    strHtml += "</ul>\n";
    alertFram.innerHTML = strHtml;
    document.body.appendChild(alertFram);
    document.body.appendChild(shield);
    var c = 0;
    this.doAlpha = function(){
        if (c++ > 20){clearInterval(ad);return 0;}
        shield.style.filter = "alpha(opacity="+c+")";
        shield.style.opacity = ".5";
    }
    var ad = setInterval("doAlpha()",5);
    this.doOk = function(){
        //alertFram.style.display = "none";
        //shield.style.display = "none";
　　　　 document.body.removeChild(alertFram);
         document.body.removeChild(shield);
    }
    alertFram.focus();
    document.body.onselectstart = function(){return false;};
}
</script>
<style>
html, body {
	margin: 0;
	padding: 0;
	overflow: hidden;
}

.main_bg {
	background: url(../images/pic-3.jpg) -70px 0 no-repeat;
}

.main {
	width: 1000px;
	height: 388px;
	position: relative;
	margin: 0 auto;
}

.num_pic>img {
	display: block;
	width: 100%;
}

.num_box {
	height: 450px;
	width: 442px;
	position: absolute;
	left: 50%;
	top: 190px;
	margin-left: -230px;
	z-index: 8;
	overflow: hidden;
	text-align: center;
}

.num {
	background: url(../images/num.png) top center repeat-y;
	width: 78px;
	height: 128px;
	background-size: cover;
	display: inline-block;
}

.btn {
	width: 264px;
	height: 89px;
	position: absolute;
	left: 50%;
	top: 206px;
	margin-left: -169px;
	cursor: pointer;
	clear: both;
}

#global {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 9;
	display: none;
	overflow: hidden;
}
</style>
</head>
<body>

	<input id="_nums" name="_nums" type="hidden" readonly="readonly" />

	<div class="num_pic">
		<img src="../images/pic-1.jpg" />
		<img src="../images/pic-2.jpg" />
		<!--<img src="../images/pic-2-1.jpg" />
		<img src="../images/pic-2-2.jpg" />-->
	</div>
	
	<div class="main_bg">
		<div class="main">
			<div class="num_box">
				<div class="num"></div>
				<div class="num"></div>
				<div class="num"></div>
				<div class="num"></div>
				<div class="btn" onclick="cj();">
					<img src="../images/btn-start.png" />
				</div>
			</div>
		</div>
	</div>
	
	<div class="num_pic">
		<img src="../images/pic-5.jpg" />
	</div>
	
	<div id="global"></div>

	<script type="text/javascript">
	
		var rootPath = getRootPath();
		
		var isBegin = false;
		
		var u = 130;//num的高度
		
		function cj(){
			
			$(".btn").removeAttr("onclick");
			
			if(isBegin) {
				alert("您已抽取，更多活动，敬请关注广汽三菱服务号！祝您用车愉快！");
				return ;
			}
			
			isBegin = true;
			
			getReward();
			
			$(".num").css('backgroundPositionY',0);
			$('#res').text('随机摇奖结果 = ' + $("#_nums").val());
			
			var num_arr = ($("#_nums").val()).split("");
			
			if(0 != $("#_nums").val()){
				$(".num").each(function(index){
					var _num = $(this);
					setTimeout(function(){
						_num.animate({ 
							backgroundPositionY: (u*60) - (u*num_arr[index])
						},{
							duration: 6000 + index * 3000,
							easing: "easeInOutCirc",
							complete: function(){
								if(index==3){
									$("#global").show();
									$("#global").snowfall({
										image: "../images/huaban2.png",
										flakeCount:30,
										minSize: 20,
										maxSize: 80
									});
									isBegin = true;
									alert("恭喜您获得" + parseInt($("#_nums").val() || 0) + "积分，您可以在个人中心我的积分查看！");
									$(".btn").attr("onclick","cj();");
								}
							}
						});
					}, index * 300);
				});
			}
		}
		
		$("#global").click(function(){
			$("#global").snowfall('clear');
			$(this).hide();
		});
		
		function getReward(){
			$.ajax({
				headers: {'Cookie' : document.cookie },
				type:"POST", 
		        url:rootPath + "/pointActivity/api/v1/getPointReward",
		        //url : "http://localhost:9013/pointActivity/api/v1/getPointReward",
		        dataType:"json",
		        async: false,
		        contentType:"application/json",               
		        data:null, 
		        success:function(json){
		        	
		        	var resultData = JSON.parse(json.data);
		        	
		        	if(check(resultData)){
		        		
		        		var pointLength = resultData.getPoint.toString().length;
		        		
		        		if(pointLength == 1){
		        			$("#_nums").val("000" + resultData.getPoint || "0000");
		        		} else if(pointLength == 2){
		        			$("#_nums").val("00" + resultData.getPoint || "0000");
		        		} else if(pointLength == 3){
		        			$("#_nums").val("0" + resultData.getPoint || "0000");
		        		} else {
		        			$("#_nums").val("" + resultData.getPoint || "0000");
		        		}
		        		
		        	} else {
		        		return false;
		        	}
		        }
		     });
		}
		
		function check(resultData){
			
			if(resultData.hasOwnProperty("isRepeat")){
				if(resultData.isRepeat){
					alert("您已抽取，更多活动，敬请关注广汽三菱服务号！祝您用车愉快！");
					return false;
				}
			} else if (resultData.hasOwnProperty("isVinRepeat")){
				if(resultData.isVinRepeat){
					alert("您的车辆已参加活动！");
					return false;
				}
			} else {

				if(resultData.getPointStatus != "success"){
					
					if(resultData.userType == 100001 && typeof(resultData.userType) != "undefined"){
						window.location.href = rootPath + "/views/homepage/signUp.html?my_sysdate=" + new Date();
						return false;
					}
					
					if(resultData.userType == 100002 && typeof(resultData.userType) != "undefined"){
						window.location.href = rootPath + "/views/homepage/Authentication.html?my_sysdate=" + new Date();
						return false;
					}

					if(resultData.userType == 100000 && typeof(resultData.userType) != "undefined"){
						alert("请关注公众号.");
						return false;
					}
					
					if(resultData.userType == 100004 && typeof(resultData.userType) != "undefined"){
						alert("经销商尚未开票,请与经销商联系.");
						return false;
					}
					
					if(resultData.activityType == 2 && typeof(resultData.activityType) != "undefined"){
						alert("没有可参加的活动.");
						return false;
					}
					
					if(resultData.activityIsEnd == "false" && typeof(resultData.activityIsEnd) != "undefined"){
						alert("活动已下线.更多活动敬请关注！");
						return false;
					}
					
					if(resultData.activityIsStart == "false" && typeof(resultData.activityIsStart) != "undefined"){
						alert("活动尚未开始.敬请期待！");
						return false;
					}
					
					if(resultData.getPointStatus == "fail"){
						alert("活动礼包已发放完毕，下次活动不见不散！");
						return false;
					}
					
					if(resultData.surplusPacke == "false" && typeof(resultData.surplusPacke) != "undefined"){
						alert("活动礼包已发放完毕，下次活动不见不散！");
						return false;
					}
				}
			}
			
			return true;
		}
	</script>
</body>

</html>